<template>
	<view>
		<navBar title="详情"></navBar>
		<image :src="imgUrls(pageData.banner)" mode="widthFix" class="rows"></image>
		<!-- 	<image src="../../static/tb.png" mode="widthFix" class="rows"></image> -->
		<view class="Info">
			<text class="firmName">{{ pageData.firmName }}</text>
			<view class="infoLi">
				<image :src="staticImg('gh.png')" mode="aspectFit" class="Icon"></image>
				<view class="d-flex a-center" @click="Call(pageData.tel)">
					<text class="black size28">电话：</text>
					<text class="color-666 size28">{{ pageData.tel }}</text>
				</view>
			</view>
			<view class="infoLi">
				<image :src="staticImg('wz.png')" mode="aspectFit" class="Icon"></image>
				<view class="d-flex a-center">
					<text class="black size28">地址：</text>
					<text class="color-666 size28">{{ pageData.address }}</text>
				</view>
			</view>
			<view class="infoLi">
				<image :src="staticImg('sj.png')" mode="aspectFit" class="Icon"></image>
				<view class="d-flex a-center">
					<text class="black size28">时间：</text>
					<text class="color-666 size28">{{ pageData.businessHour }}</text>
				</view>
			</view>
		</view>

		<view class="Line"></view>

		<view class="rows padding20 size28">
			<up-parse :content="pageData.lawyerDesc"></up-parse>
		</view>
	</view>
</template>

<script setup>
	import { ref, computed, watch } from 'vue';
	import Http from '@/utils/request.js';
	import { imgUrls, Call, Toast, staticImg } from '@/utils/utils.js';
	import { onLoad, onShow, onReachBottom } from '@dcloudio/uni-app';
	import { useMainStore } from '@/stores/index';

	const mainStore = useMainStore();
	const pageData = ref('');
	const id = ref('');
	onLoad((opt) => {
		if (opt.id) id.value = opt.id;
		FirmDetail();
	});

	const FirmDetail = () => {
		Http.get({
			url: '/hr/getLawyerFirmDetail',
			data: {
				id: id.value,
			},
		}).then((res) => {
			if (res.code != 0) return Toast(res.msg);
			const result = res.data;
			pageData.value = result;
		});
	};
</script>

<style lang="scss" scoped>
	.Info {
		width: 100%;
		padding: 24rpx 20rpx;
		.firmName {
			color: #000;
			font-size: 30rpx;
			font-weight: 500;
		}
		.infoLi {
			width: 100%;
			display: flex;
			align-items: center;
			margin-top: 20rpx;
			.Icon {
				width: 22rpx;
				height: 26rpx;
				margin-right: 20rpx;
			}
		}
	}

	.Line {
		width: 100%;
		height: 20rpx;
		background-color: $page;
	}
</style>